<template>
  <view class="shoppingBox flex flex-row" >
    <image v-if="visible" @tap="jump('stockCart')"  class="img" src="http://121.41.75.32:8002/file/static/shoppingCart01.png" />
    <view class="price">
      <view>箱数:{{boxval}}</view>
      <view>零数:{{mainval}}</view>
    </view>
    <view class="settlement flex a-item j-content" v-if="type === '3'" @tap="jump('appear')">
      去上报
    </view>
    <view class="settlement flex a-item j-content" v-else-if="type === '5'"  @tap="showWarehouse = true">
      提交
    </view>
    <view  v-if="visible" class="redDot flex a-item j-content">{{ addstocklist.length }}</view>
    <view class="commitScutomer" v-if="showWarehouse">
      <view style="padding: 20rpx">
        选择仓库:<w-select defaultValue="请选择仓库" filterable @change="changeWarehouse" :list='warehouseList' keyName='id' valueName="name" />
      </view>
      <view style="padding: 20rpx">
        选择科目:<w-select defaultValue="请选择科目" filterable @change="changeSubject" :list='subjectList' keyName='id' valueName="name" />
      </view>
      <view class="line-division"></view>
      <view class="flex flex-reverse">
        <button size="mini" @click="showWarehouse = false">取消</button>
        <button size="mini" @click="submitWarehouse">确认</button>
      </view>
    </view>
  </view>
</template>

<script>

import {basSubjectList, contract} from "../service/api/shopping";
import {getBasWarehouseList} from "../service/api/logistics";

export default {
  name: "shoppingCart",
  props:{
    addstocklist:{
      type: Array,
      default: ()=>[],
    },
    visible:{
      type:Boolean,
      default: true
    },
    type:{
      type:String,
      default:'1'
    },
    photo:{
      type:String,
      default:''
    },
    back:{
      type:String,
      default:''
    },

    news:{
      type:String,
      default:''
    },

    customerId:{
      type:[String,Number],
      default:0
    }

  },
  data(){
    return{
      showWarehouse:false,
      warehouseName:'',
      warehouseList:[],
      warehouseId:null,
      subjectList:[],
      subjectId:null,
      boxval:0,
      mainval:0,
    }

  },
  created() {
    getBasWarehouseList({page:1,size:100}).then(res=>{
    }).catch(err=>{
      this.warehouseList = err.content
    })
    basSubjectList({page:1,size:100}).then(res=>{
    }).catch(err=>{
      this.subjectList = err.content
    })
  },
  computed:{
    getnum(){
      this.boxval = this.addstocklist.reduce((prev,cur)=>prev+Number(cur.boxNum),0)
      this.mainval = this.addstocklist.reduce((prev,cur)=>prev+Number(cur.mainNum),0)
    }
  },
  methods:{
    jump(ty){
      if (!this.addstocklist.length)return uni.showToast({title:"请先选择商品",icon:'none'})
      if (ty==='stockCart')
        this.back=1
        
      console.log(this.back,'ddddddddddddd');
      uni.redirectTo({url:`/pageShopping/${ty}/index?type=${this.type}&&news=${this.news}&photo=${this.photo}&back=${this.back}`})
    },
    submitWarehouse(){
      if (this.warehouseId === null || this.subjectId=== null)return  uni.showToast({title:"仓库和科目必输",icon:'none'})
      this.showWarehouse = false
      this.submit()
    },
    changeWarehouse(e){
      this.warehouseId = e.id
    },
    changeSubject(e){
      this.subjectId = e.id
    },
    submit(){
      if (!this.customerId || !this.addstocklist.length)return uni.showToast({title:"请检查是否选择客户或商品",icon:'none'})
      const warehouseId = this.warehouseId
      const detailList = this.addstocklist.map(item=>{
        return{
          goodsId:item.goodsId,
          goodsCount:item.goodsCount,
          warehouseId,
          boxNum:item.boxNum,
          mainNum:item.mainNum,
          mainUnitId:item.mainUnitId,
          boxUnitId:item.boxUnitId,
          boxUnitCount:item.boxUnitCount,
          goodsTagId: item.goodsTagId,
          mainUnitCount:item.mainUnitCount,
          taxPrice:0,
          taxBoxPrice:0
        }
      })
      const data = {visitedCustomerId:this.customerId,wareFeeGoodsOutDto:{customerId:this.customerId,subjectId:this.subjectId,warehouseId,detailList}}
      contract(data).then(res=>{
        if (res.status === 200){
          this.$emit('upstock')
          uni.showToast({title:'提交成功',icon:'none'})
        }else {
          uni.showToast({title:res.msg,icon:'none'})
        }
      })
    }
  }
}
</script>

<style lang="scss" scoped>
.shoppingBox{
  background-image:linear-gradient(to right,#000000, #585858);
  height: 130rpx;
  border-radius: 130rpx;
  width: 700rpx;
  position: fixed;
  bottom: 20rpx;
  margin-left: 25rpx;
  z-index: 98;
  color:#ffffff;
  .img{
    width: 130rpx;
    height: 130rpx;
    margin-left: 50rpx;
  }
  .settlement{
    background: red;
    color: #ffffff;
    width: 200rpx;
    position: absolute;
    right: 0;
    height: 100%;
    border-radius: 0 200rpx 200rpx 0;
    font-size: 35rpx;
  }
  .price{
    color: #ffffff;
    width: 300rpx;
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
    font-size: 40rpx;
    padding-left: 30rpx;
    // &:before{
    //   content: '￥';
    //   font-size: 26rpx;
    // }
  }
}
.redDot{
  min-width: 40rpx;
  height: 40rpx;
  background: red;
  border-radius: 40rpx;
  border: #ffffff 2px solid;
  position: absolute;
  left: 150rpx;
  top: 10rpx;
}
.commitScutomer{
  position: fixed;
  background-color: #ffffff;
  top: 30%;
  left: 20%;
  width: 450rpx;
  z-index: 999;
  border-radius: 25rpx;
  box-shadow: #555555 0 0 5px 1px;
}
</style>
